<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detectio1n" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>搜索内容</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/vant.css">
    <link rel="stylesheet" href="../../css/main.css">
    <link rel="stylesheet" href="../../css/varieties.css">

    <style>
        .warehouse-name span {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .warehouse-name span:last-child {
            width: 30%;
            text-align: end;

        }

        .warehouse-name span:first-child {
            width: 70%;
        }

        .recruit-list .recruit-list-item {
            margin-bottom: .1rem;
        }
    </style>
</head>

<body>
    <div class="app" v-cloak>
        <!-- 求职 招聘-->
        <div class="recruit-list" v-if="categoryName == 0">
            <div class="recruit-list-item" v-for="(item,index) in listSearch" :key="item.id"
                @click="forwardPage('recruit_detail_win', '../recruit/', {id: item.id, type: title, title: item.workTypeName})">
                <div class="f1 flex-x-sb">
                    <div class="title">
                        <span>{{item.workTypeName}}</span>
                        <span :class="item.status==0?'red':'blueBorder'">{{item.status == 0 ? '停止' + offerStatus:
                            offerStatus + '中'}}</span>
                    </div>
                    <div v-if="item.status == 1">
                        <div class="money" v-if="item.salary">
                            <span>¥</span>{{item.salary}} {{item.salaryUnitName}}
                        </div>
                        <div class="money" v-else>面议</div>
                    </div>
                </div>
                <div class="f2 flex-x-s tag-list">
                    <div class="label" v-for="(it,idx) in item.tags" :key="idx">{{it.name}}</div>
                </div>
                <div class="f3 flex-x-sb">
                    <span class="f3-address">{{item.addressName}}</span>
                    <span>{{item.publishTime | handleTimePlus('//::')}}</span>
                    <span>距离：{{item.countDistance}}</span>
                    <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/phone.png" alt="" @click.stop="call(item.phone)">
                </div>
            </div>
            <div class="collect-empty" v-show="listSearch.length===0">
                <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/empty/empty.png" alt="">
                <div>暂无数据～</div>
            </div>
        </div>
        <!-- 车找货 货找车 -->
        <div v-if="categoryName == 1">
            <div class="logistics-item flex-x-s" v-for="(item,index) in listSearch"
                @click="forwardPage('warehouse_logistics_detail_win', '../warehouse_logistics/', {type: 0, status: item.type, id: item.id,title:item.title})"
                v-if="forCarGoodType == item.type">
                <div class="left-mainImg">
                    <img :src="item.imageUrl?item.imageUrl:'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/default/item_img.png'" alt="">
                    <img class="sign" :src="item.type==1?'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/czh.png':'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/hzc.png'" alt="">
                </div>
                <div class="right">
                    <div>{{item.title}}</div>
                    <div class="area flex-x-s">
                        <div>{{item.departureCityName}}</div>
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/arrival_arrow.png" alt="">
                        <div>{{item.destinationCityName}}</div>
                        <div>{{item.distance | filterDistance}}</div>
                    </div>
                    <div class="distance">距离：{{item | getMinDistance | filterDistance}}</div>
                    <div class="r-end">
                        <div v-if="item.freight === null || item.freight === ''">
                            <span>面议</span>
                        </div>
                        <div v-else>
                            <span class="money" v-if="item.freight<10000">¥</span>{{item.freight}}
                            {{item.freightUnitName}}
                        </div>
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/kf.png" alt="">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/phone.png" alt="" @click.stop="call(item.phone)">
                    </div>
                </div>
            </div>
        </div>
        <!-- 维修保养 -->
        <div v-if="categoryName == 2">
            <div class="logistics-item flex-x-s-s" v-for="(item,index) in listSearch" :key="index"
                @click="forwardPage('maintenance_detail_win', '../maintenance/',{id: item.id,title:item.shopName})">
                <img :src="item.imageUrl" alt="">
                <div class="repair-right">
                    <div class="repair-f1">{{item.shopName}}</div>
                    <div class="repair-f2">{{item.addressName}}</div>
                    <div class="repair-f3 flex-x-s">
                        <div v-for="tag in item.tags" :key="tag.id">{{tag.name}}</div>
                    </div>
                    <div class="repair-f4 flex-x-e-c">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/kf.png" alt="" @click.stop="gIMCommon(item.userId)">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/nav.png" alt="" @click.stop="goMap(item)">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/phone.png" alt="" @click.stop="call(item.phone)">
                    </div>
                </div>
            </div>
        </div>
        <!-- 配件商城 设备出租 设备出售-->
        <div class="store flex-x-sb flex-wrap" v-if="categoryName == 3">
            <div class="store-item flex-y-c-s" v-for="(item,index) in listSearch" :key="index"
                @click="forwardPage('goods_detail_win', '../whole_sale/', {detailItem:item})">
                <img :src="item.imageUrl" alt="">
                <div class="title">{{item.title}}</div>
                <div class="price" v-if="item.price===null || item.price===''">
                    面议
                </div>
                <div class="price" v-else>
                    <span class="money" v-if="item.price<10000">¥</span>
                    {{filterPrice(item.price)}}
                </div>
            </div>
        </div>
        <!-- 设备求租 设备求购-->
        <div v-if="categoryName == 4">
            <div class="rent-item" v-for="(item,index) in listSearch" :key="index"
                @click="forwardPage('ask_rent_win', '../whole_sale/', {detailItem:item})">
                <div class="rent-f1">{{item.title}}</div>
                <div class="rent-f2 flex-x-sb">
                    <span>{{item.publishTime | handleTimePlus('//::')}}</span>
                    <span>距离：{{item.countDistance}}</span>
                </div>
            </div>
        </div>
        <!-- 仓储 -->
        <div v-if="categoryName == 5">
            <div class="logistics-item flex-x-s" v-for="(item,index) in listSearch"
                @click="forwardPage('warehouse_logistics_detail_win', '../warehouse_logistics/', {type: 1, id: item.id, title: item.title})">
                <div class="left-mainImg">
                    <img :src="item.imageUrl?item.imageUrl:'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/default/item_img.png'" alt="">
                </div>
                <div class="right">
                    <div class="warehouse-name flex-x-sb">
                        <span>{{item.title}}</span>
                        <span>{{item.addressName}}</span>
                    </div>
                    <div class="carpet-area">
                        <span>室内</span>
                        <span>{{item.area}} m²</span>
                    </div>
                    <div class="distance">距离：{{item.countDistance}}</div>
                    <div class="r-end">
                        <div v-if="item.price===null || item.price===''">
                            面议
                        </div>
                        <div v-else>
                            <span class="money">¥</span>{{item.price}}{{item.unitName}}
                        </div>
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/kf.png" alt="">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/home/phone.png" alt="" @click.stop="call(item.phone)">
                    </div>
                </div>
            </div>
        </div>
        <div v-if="categoryName == 6">
            <div class="deformed_steel_list">
                <div class="deformed_steel_list-item" v-for="item in listSearch" :key="item" @click="goDetail(item)">
                    <div class="left">
                        <img class="img-goods" :src="item.imageUrl" alt="">
                        <!-- <img class="img-goods"
                            v-lazy="item.imageUrl?item.imageUrl:'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/default/item_img.png'" alt=""> -->

                        <div class="type-sign" :class="item.type==0?'type-sign-rent':'type-sign-sale'">
                            {{item.type==0?'出售':'出租'}}</div>
                    </div>
                    <div class="right">
                        <div class="title">{{item.title}}</div>
                        <div class="spec">规格{{item.model}}</div>
                        <div class="bottom">
                            <div class="shop-iden">{{item.typeName}}</div>
                            <div class="distance">{{item.countDistance }}</div>
                        </div>
                    </div>
                </div>
                <!-- <div class="no-more" v-if="!hasNext">没有更多了</div> -->
            </div>
        </div>
        <div v-if="categoryName == 7">
            <!-- 资讯 -->
            <div class="news">
                <div class="news-item" v-for="(item,index) in listSearch" :key="index" @click="goNewsDetail(item)">
                    <div class="left">
                        <div class="new-title">{{item.title}}</div>
                        <div class="time">{{handleTimeYMD2(item.createTime)}}</div>
                    </div>
                    <div class="right">
                        <img v-lazy="item.coverPicture?item.coverPicture:'https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/default/loading3.png'" alt=""
                            width="100" height="80" style="border-radius: 0.04rem;">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../script/api.js"></script>
    <script src="../../script/flexible.js"></script>
    <script src="../../script/fastclick.js"></script>
    <script src="../../script/vue.min.js"></script>
    <script src="../../script/iconfont.js"></script>
    <script src="../../script/vant.min.js"></script>
    <script src="../../script/common.js"></script>
    <script src="../../script/restful.js"></script>
    <script src="../../script/businessCommon.js"></script>
    <script src="../../script/vue-lazyload.js"></script>

    <script>
        apiready = function () {
            imgLazyLoad();
            vm = new Vue({
                el: '.app',
                data() {
                    var title = "0"
                    return {
                        title,
                        showPh: false,
                        categoryName: -1,
                        queryInfo: {
                            keyword: api.pageParam.keyword,
                            pageNum: 1,
                            pageSize: 10,
                            status: 1,
                            location: '',
                            title: null
                        },
                        listSearch: [],
                        hasNext: false,
                        name: '',
                        forCarGoodType: 0

                    }
                },
                filters: {
                    filterPrice: filterPrice
                },
                created() {
                    // var location = $api.getStorage('location_home') || {}
                    var location = api.getPrefs({
                        sync: true,
                        key: 'location_home'
                    }) || {}
                    this.queryInfo.location = JSON.parse(location).location;
                    console.log('传递参数：', JSON.stringify(api.pageParam));
                    var name = api.pageParam.name
                    this.name = name
                    var vm = this;
                    if (name == '求职' || name == '招聘') {
                        this.categoryName = 0
                    } else if (name == '车找货' || name == '货找车') {
                        this.categoryName = 1
                        this.forCarGoodType = name == '车找货' ? 1 : 0
                    } else if (name == '维修保养') {
                        this.categoryName = 2
                    } else if (name == '配件' || name == '出租设备' || name == '设备出售') {
                        this.categoryName = 3
                    } else if (name == '求租设备' || name == '求购设备') {
                        this.categoryName = 4
                    } else if (name == '仓储') {
                        this.categoryName = 5
                    } else if (name == '二手材料') {
                        this.categoryName = 6
                    } else if (name == '行业资讯') {
                        this.categoryName = 7
                    }
                    vm.init = null;
                    switch (name) {
                        case "设备出售":
                            vm.queryInfo.types = 0;
                            vm.queryInfo.status = 1;
                            vm.queryInfo.checkStatus = 1;
                            vm.init = index.product("getListProducts")
                            break;
                        case "求购设备":
                            vm.queryInfo.types = 0
                            vm.queryInfo.status = 1;
                            vm.init = index.equipment("getListEquipments")
                            break;
                        case "出租设备":
                            vm.queryInfo.types = 1
                            vm.queryInfo.status = 1;
                            vm.queryInfo.checkStatus = 1;
                            vm.init = index.product("getListProducts")
                            break;
                        case "求租设备":
                            vm.queryInfo.types = 1;
                            vm.queryInfo.status = 1;
                            vm.init = index.equipment("getListEquipments")
                            break;
                        case "求职":
                            vm.queryInfo.type = 1;
                            vm.title = 1;
                            delete vm.queryInfo.status;
                            vm.init = index.employ("getEmployList")
                            break;
                        case "招聘":
                            vm.queryInfo.type = 0;
                            vm.title = 0;
                            delete vm.queryInfo.status;
                            vm.init = index.employ("getEmployList")
                            break;
                        case "货找车":
                            vm.queryInfo.status = 1;
                            vm.init = index.logistically("getLogisticsList")
                            break;
                        case "车找货":
                            vm.queryInfo.status = 1;
                            vm.init = index.logistically("getLogisticsList")
                            break;
                        case "配件":
                            vm.queryInfo.types = 2
                            vm.queryInfo.status = 1;
                            vm.queryInfo.checkStatus = 1;
                            vm.init = index.product("getListProducts")
                            break;
                        case "仓储":
                            vm.queryInfo.status = 1;
                            vm.init = index.logistically("getStorehouseList")
                            break;
                        case "维修保养":
                            vm.queryInfo.status = 1;
                            vm.init = index.maintenance("getListMaintenance")
                            break;
                        case "二手材料":
                            vm.queryInfo.status = 1;
                            vm.init = index.deformedSteel("getListDeformed")
                            break;
                        case "行业资讯":
                            vm.queryInfo.status = 1;
                            vm.queryInfo.title = api.pageParam.keyword
                            vm.init = index.news("getListNews")
                            break;
                    }
                    this.getList();
                },

                filters: {
                    handleTimePlus: handleTimePlus,
                    getMinDistance: function (item) {
                        // var location = $api.getStorage('location_home')
                        var location = api.getPrefs({
                            sync: true,
                            key: 'location_home'
                        }) || {}
                        location = JSON.parse(location).location.split(',')
                        var departureLocation = item.departureLocation;
                        if (departureLocation == null) return 0;
                        var distance = getDistance(departureLocation.lat, departureLocation.lon, location[1], location[0]);
                        return distance;
                    },
                    filterDistance(val) {
                        val = val / 1000
                        if (val > 500) {
                            return '500km以上'
                        } else {
                            return val.toFixed(1) + 'km'
                        }
                    }
                },
                computed: {
                    offerStatus() {
                        return this.title == 0 ? "招聘" : "求职"
                    }
                },
                mounted() {

                },
                methods: {
                    goMap(device) {
                        openMap(device.location, device.addressName)
                    },
                    getList() {
                        var vm = this;
                        var location = this.queryInfo.location.split(',')
                        this.init(this.queryInfo, function (ret) {
                            ret.data.list.map(item => {
                                if (item.imageUrl) {
                                    item.imageUrl = item.imageUrl.replace(/_[0-9x]+(\.[a-z]{3})$/, '$1')
                                }
                                if (item.location) {
                                    var countDistance = getDistance(location[1], location[0], item.location.lat, item.location.lon)
                                    countDistance = (Number(countDistance) / 1000).toFixed(1)
                                    item.countDistance = countDistance > 500 ? '500km 以上' : countDistance + 'km'
                                }
                            })
                            if (vm.queryInfo.pageNum == 1) {
                                vm.listSearch = ret.data.list;
                            } else {
                                vm.listSearch = vm.listSearch.concat(ret.data.list);
                            }
                            console.log('列表：', JSON.stringify(ret))
                            vm.hasNext = ret.data.hasNext;
                        });
                    },
                    call(phone) {
                        if (!checkToken()) return false;
                        phone = phone.split(',')
                        api.actionSheet({
                            cancelTitle: '取消',
                            buttons: phone
                        }, function (ret, err) {
                            if (ret.buttonIndex > phone.length) return false;
                            api.call({
                                type: 'call_type',
                                number: phone[ret.buttonIndex - 1]
                            });
                        });
                    },
                    //资讯详情
                    goNewsDetail(item) {
                        api.openWin({
                            name: 'industry_news_detail_win',
                            url: '../industry_news/industry_news_detail_win.html',
                            bounces: false,
                            pageParam: {
                                id: item.id,
                            }
                        });
                    },
                    //详情
                    goDetail(item) {
                        api.openWin({
                            name: 'deformed_detail_win',
                            url: '../deformed_steel/deformed_detail_win.html',
                            bounces: false,
                            pageParam: {
                                id: item.id,
                                // title: "",
                                // titlePlus: '异型钢租售'
                            }
                        });
                    },
                    forwardPage(url, relative, options) {
                        if (this.name == '设备出售') {
                            options.title = 'SELL_DEVICE'
                        } else if (this.name == '出租设备') {
                            options.title = 'LEASE_DEVICE'
                        } else if (this.name == '配件') {
                            options.title = 'PARTS'
                        } else if (this.name == '求购设备') {
                            options.title = 'BUY_DEVICE'
                        } else if (this.name == '求租设备') {
                            options.title = 'RENT_DEVICE'
                        } else if (this.name == '车找货') {
                            options.type = 0
                            options.status = 1
                        } else if (this.name == '货找车') {
                            options.type = 0
                            options.status = 0
                        } else if (this.name == '货找车') {
                            options.type = 1
                        } else if (this.name == '招聘') {
                            options.type = 0
                        } else if (this.name == '求职') {
                            options.type = 1
                        }
                        url = url + ".html";
                        api.openWin({
                            name: url,
                            url: (relative || "") + url,
                            pageParam: options
                        })
                    },
                },

            })
            api.setRefreshHeaderInfo({
                bgColor: '#f7f7f7',
                textDown: '下拉更新有惊喜',
                textUp: '松开可以刷新'
            }, function (ret, err) {
                vm.queryInfo.pageNum = 1;
                vm.getList();

                api.refreshHeaderLoadDone()
            });

            // 上拉加载
            api.addEventListener({
                name: 'scrolltobottom',
                extra: {
                    threshold: -10
                }
            }, function (ret, err) {
                if (vm.hasNext) {
                    vm.queryInfo.pageNum++
                    vm.getList();
                }
            });
        }
    </script>
</body>

</html>